<template>
	<view class="" style="background: #F0E3CE;min-height: 100vh;"
		:style="{background:'url('+Imgbase+'/new_goodlx_bgc.png)','background-size':'100%',}">
		<view class="padding-top-50 padding-left-40">
			<image class="w-80 h-80" :src="Imgbase + '/new_goodlx_img1.png'" mode="aspectFit" @click="back">
			</image>
		</view>

		<!-- 可用收益 -->
		<view class="w-680 h-220 margin-auto margin-top-400 padding-left-50 padding-right-50 padding-top-40"
			:style="{background:'url('+Imgbase+'/new_goodlx_img9.png)','background-size':'100% 100%',}">

			<view class="w100 intid font-weight-500">
				<input type="text" placeholder="请输入邀请人id" v-model="id" />
			</view>

			<view class="w-200 margin-auto padding-top-30">
				<u-button text="确定" color="#FF9B4E" @click="npBindUp"></u-button>
			</view>

		</view>

		<!-- 收益总览 -->
		<view class="w-680 h-350 margin-auto padding-left-200 padding-top-190 Afont item_top font-35"
			:style="{background:'url('+Imgbase+'/new_goodlx_img12.png)','background-size':'100% 100%',}">

			<view class="">
				共邀请 <text class="num padding-10"> {{totalUser}} </text> 人
			</view>
			<view class="padding-top-20">
				共获得 <text class="num padding-10"> {{totalCoupon}} </text> good豆
			</view>
		</view>

		<view class="w-680 margin-auto flex-between padding-top-35">
			<view class="w100 text-center">
				<button class="w-310 h-100"
					style="display: flex;justify-content: right;overflow: hidden;background-color:transparent;"
					open-type="share">
					<image class="w100 h100" mode="aspectFit" :src="Imgbase + '/new_goodlx_img3.png'"></image>
				</button>
			</view>
		</view>

		<view class="item_bot w100 margin-top-100 Afont padding-bottom-100" v-if="list.length > 0">
			<view class="text-center font-35 padding-bottom-20">
				记录
			</view>

			<scroll-view scroll-y class="w100 h-350 " scroll-with-animation style="overflow: hidden;"
				@scrolltolower="onbottom()">

				<view class="record margin-auto radius-15 padding-20 margin-bottom-15" v-for="(item,index) in list"
					:key="index">
					<view class="flex-between padding-bottom-10">
						<view class="">
							{{item.createtime_text}}
						</view>

						<view class="">
							{{item.memo}}
						</view>
					</view>

					<view class="padding-bottom-10">
						用户名: {{item.data}}
					</view>

					<view class="padding-bottom-10">
						获得{{item.money}} good豆
					</view>

				</view>

			</scroll-view>
		</view>

		<u-toast ref="uToast"></u-toast>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				Imgbase: getApp().globalData.Imgbase,
				id: '',
				totalUser: 0,
				totalCoupon: 0,
				page: 1,
				list: []
			}
		},
		onLoad(e) {

		},
		onShow() {
			this.inviteDetail()

			if (uni.getStorageSync('token') == '') {
				this.$uniApi.trylogin();
			}
		},
		//分享功能
		onShareAppMessage(res) {
			let _this = this;
			return {
				title: '拉新有礼',
				path: '/pagesA/newpage/laxin',
			}
		},
		//分享功能
		onShareTimeline(res) {
			let _this = this;
			return {
				title: '拉新有礼',
				path: '/pagesA/newpage/laxin',
			}
		},
		methods: {
			onbottom() {
				this.page++;
				this.inviteDetail();
			},
			back() {
				let routes = getCurrentPages();
				if (routes.length == 1) {
					uni.switchTab({
						url: '/pages/index/kpindex'
					})
				} else {
					uni.navigateBack()
				}
			},
			// 邀请新用户
			async npBindUp() {
				let _this = this;
				if (_this.id == '') {
					_this.$refs.uToast.show({
						message: '请输入邀请人id'
					})
					return
				}

				let item = await this.$api.post('user/npBindUp', {
					token: uni.getStorageSync('token'),
					uname: _this.id
				})

				if (item.code == 1) {
					_this.$refs.uToast.show({
						message: item.msg
					})
				}
			},
			// 查看邀请记录
			async inviteDetail() {
				let _this = this;
				let item = await this.$api.post('user/inviteDetail', {
					token: uni.getStorageSync('token'),
					page: _this.page,
					// limit: 1
				})

				if (item.code == 1) {
					_this.totalCoupon = item.data.totalCoupon
					_this.totalUser = item.data.totalUser
					_this.list = _this.list.concat(item.data.list)
				}
			},
		},
	}
</script>

<style lang="less" scoped>
	.intid {
		border-bottom: 4rpx solid #973F23;
	}

	.item_top {
		color: #FF7A7A;

		.num {
			color: red;
		}
	}

	.item_bot {
		background-color: #FF9B4E;
		min-height: 500rpx;
		color: #973F23;

		.record {
			width: 90%;
			background-color: rgba(255, 255, 255, .7);
		}
	}

	button:after {
		border: none;
	}
</style>